<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script>
			function show_uname(){
				uname_msg.innerHTML="请输入用户名6-10";
				
			}
			function check_uname(){
				var _uname=uname.value;
				if(!_uname){
					uname_msg.innerHTML="用户名不能为空"
				}else if(_uname.length<6 || _uname.length>10){
					uname_msg.innerHTML="格式不正确"
				}else{
					uname_msg.innerHTML="√"
				}
			}
			</script>
			<script>
			function show_uname1(){
				upwd_msg.innerHTML="请输入用户名8-12";
				
			}
			function check_uname1(){
				var _upwd=upwd.value;
				if(!_upwd){
					upwd_msg.innerHTML="密码不能为空"
				}else if(_upwd.length<8 || _upwd.length>12){
					upwd_msg.innerHTML="格式不正确"
				}else{
					upwd_msg.innerHTML="√"
				}
			}
			</script>
			<script>		
			function show_uname2(){
				cpwd_msg.innerHTML="请再输入密码";				
			}
			function check_uname2(){
				var _cpwd=cpwd.value;
				if(!cpwd.value){
					cpwd_msg.innerHTML="密码不能为空"
				}else if(cpwd.value==upwd.value){
					cpwd_msg.innerHTML="格式不正确"
				}else{
					cpwd_msg.innerHTML="√"
				}
				var _cpwd=cpwd.value;
				if(!_cpwd){
					cpwd_msg.innerHTML="请确认密码";
				}else if(upwd==cpwd){
					cpwd_msg.innerHTML="√"
				}
			}
			function show(){	
				var _uname=uname_msg.innerHTML;
				var _upwd=upwd_msg.innerHTML;
				var _cpwd=cpwd_msg.innerHTML;
				if(_uname=="√" && _upwd=="√" && _cpwd=="√"){
					alert("登录成功")
				}else{
					alert("登录失败")
				}
			}
		</script>
	</head>
	<body>
		<input onfocus="show_uname()" onblur="check_uname()" id="uname" type="text" placeholder="请输入用户名">
		<span id="uname_msg"></span><br>
		<input onfocus="show_uname1()" onblur="check_uname1()" id="upwd" type="text" placeholder="请输入密码">
		<span id="upwd_msg"></span><br>
		<input onfocus="show_uname2()" onblur="check_uname2()" id="cpwd" type="text" placeholder="请确认密码">
		<span id="cpwd_msg"></span><br>
		<button onclick="show()">登录</button>
	</body>
</html>
